<script setup lang="ts">
/**
 * @title 实时告警
 */

import {
  Close,
  ColdDrink,
  Edit,
  View,
} from '@element-plus/icons-vue'
import SearchForm from './components/SearchForm.vue'
import IgnoreWarningModal from './components/IgnoreWarningModal.vue'
import AssignWarningModal from './components/AssignWarningModal.vue'
import AuditWarningModal from './components/AuditWarningModal.vue'
import TableLists from '@/components/TableLists/TableLists.vue'
import ListsPagination from '@/components/ListsPagination/ListsPagination.vue'

import {
  calculateTheLastTime,
  useUserLists,
  useWarningList,
  useWorkOrder,
} from '@/mixins/Warning'
import { WARNING_STATES } from '@/enum'
import type { WarningInfo } from '@/types'
import ViewDetailsModal from './components/ViewDetailsModal.vue'

const searchFormRef = ref<InstanceType<
  typeof SearchForm
> | null>(null)
const ignoreWarningModalRef
  = ref<InstanceType<typeof IgnoreWarningModal>>()
const assignWarningModalRef
  = ref<InstanceType<typeof AssignWarningModal>>()
const auditWarningModalRef
  = ref<InstanceType<typeof AuditWarningModal>>()
const viewDetailsModalRef
  = ref<InstanceType<typeof ViewDetailsModal>>()
const [warningInfo, setWarningInfo] = useShallowState<
  Partial<WarningInfo>
>({
  id: 0,
})

const { userLists, getUserLists } = useUserLists()
const { order, getOrderInfo } = useWorkOrder()
const { loading, lists, columns, pagination, getLists, handleDownload }
  = useWarningList()

async function queryLists() {
  const { state, type, ...rest } = searchFormRef.value?.query || {}
  getLists((pageNumber, pageSize) => ({
    type: '1', // 查实时告警信息
    pageNumber,
    pageSize,
    state,
    warningType: type,
    ...rest,
  }))
}

function clickSearch() {
  pagination.pageNumber = 1
  nextTick(() => {
    queryLists()
  })
}
function clickIgnoreRow(row: any) {
  setWarningInfo(row)
  ignoreWarningModalRef.value?.open()
}
function clickAssignRow(row: any) {
  setWarningInfo({
    ...row,
    warningLastTime: calculateTheLastTime(
      row.warningStartTime,
    ),
  })
  getUserLists()
  assignWarningModalRef.value?.open()
}
function clickAuditRow(row: any) {
  setWarningInfo({
    ...row,
    warningLastTime: calculateTheLastTime(
      row.warningStartTime,
    ),
  })
  getOrderInfo(row.workOrderNum)
  auditWarningModalRef.value?.open()
}
function clickViewRow(row: any) {
  setWarningInfo({
    ...row,
    warningLastTime: calculateTheLastTime(
      row.warningStartTime,
    ),
  })
  if (row.workOrderNum) {
    getOrderInfo(row.workOrderNum)
  }
  else {
    order.value = {}
  }
  viewDetailsModalRef.value?.open()
}

function clickDownload() {
  const { state, type } = searchFormRef.value?.query || {}
  handleDownload((pageNumber, pageSize) => ({
    type: '1', // 查实时告警信息
    pageNumber,
    pageSize,
    state,
    warningType: type,
  }))
}

const route = useRoute()
watchEffect(async () => {
  const { type, state } = route.query
  if (searchFormRef.value) {
    searchFormRef.value.query.type = type ? Number(type) : undefined
    searchFormRef.value.query.state = state ? Number(state) : undefined

    pagination.pageNumber = 1
    await nextTick()
    queryLists()
  }
})

onMounted(() => {
  queryLists()
})
</script>

<template>
  <div class="padding-sm flex flex-col container">
    <TableLists
      :loading="loading" :lists="lists" :columns="columns"
      show-overflow-tooltip :show-toolbox="true"
      :operate-width="160"
      custom-download @download="clickDownload"
    >
      <template #actions>
        <SearchForm ref="searchFormRef" @search="clickSearch" />
      </template>
      <template #operate="{ row }">
        <TdButton title="查看" type="primary" :icon="View" :disabled="false" @click="clickViewRow(row)" />
        <template v-if="row.state === WARNING_STATES.UNSETTLED">
          <TdButton title="处理" type="primary" :icon="Edit" :disabled="false" @click="clickAssignRow(row)" />
          <TdButton title="忽略" type="danger" :icon="Close" :disabled="false" @click="clickIgnoreRow(row)" />
        </template>
        <TdButton
          v-if="row.state === WARNING_STATES.PENDING" title="审核" type="success" :icon="ColdDrink"
          :disabled="false" @click="clickAuditRow(row)"
        />
      </template>
    </TableLists>
    <ListsPagination
      v-model:page-num="pagination.pageNumber" v-model:page-size="pagination.pageSize"
      :total="pagination.total" @current-change="queryLists" @size-change="queryLists"
    />

    <!-- 忽略告警对话框 -->
    <IgnoreWarningModal ref="ignoreWarningModalRef" :warning-id="warningInfo.id!" @save-success="queryLists" />

    <!-- 告警处理指派 -->
    <AssignWarningModal
      ref="assignWarningModalRef" :warning-info="(warningInfo as WarningInfo)" :user-lists="userLists"
      @save-success="queryLists"
    />

    <!-- 告警审核 -->
    <AuditWarningModal
      ref="auditWarningModalRef" :warning-info="(warningInfo as WarningInfo)"
      :work-order-info="order.warningWorkOrder" :work-order-users="order.warningWorkOrderUserList"
      @save-success="queryLists"
    />

    <!-- 查看告警 -->
    <ViewDetailsModal
      ref="viewDetailsModalRef" :warning-info="(warningInfo as WarningInfo)"
      :work-order-info="order.warningWorkOrder" :work-order-users="order.warningWorkOrderUserList"
    />
  </div>
</template>
